﻿<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, minimum-scale=1 maximum-scale=1, user-scalable=no">
<meta name="screen-orientation" content="portrait">
<meta name="x5-orientation" content="portrait">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="format-detection" content="telephone=no">
<meta http-equiv="x-rim-auto-match" content="none">
<title>优乐微场景</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/swiper.min.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/youle.css">
<script src="js/zepto.min.js"></script>
<script src="js/swiper.min.js"></script>
<script src="js/swiper.animate.min.js"></script>
<script type="text/javascript">
var phoneWidth = parseInt(window.screen.width);
var phoneScale = phoneWidth / 640;
var ua = navigator.userAgent;
if (/Android (\d+\.\d+)/.test(ua)) {
    var version = parseFloat(RegExp.$1);
    if (version > 2.3) {
        document.write('<meta name="viewport" content="width=640, minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">')
    } else {
        document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">')
    }
} else {
    document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">')
}
</script>
</head>
<body>
<!--音乐代码部分begin-->
<div id="lanren">
    <div id="audio-btn" class="on" onclick="media.changeClass(this,'media')">
        <audio loop src="js/music.mp3" id="media" preload="preload">
        </audio>
    </div>
</div>
<div class="arrar">
    <img src="images/arrar.png">
</div>
<!--音乐代码部分END-->
<div class="swiper-container">
    <div class="swiper-wrapper youlebox">
        
        <!--页面1-->
        <div class="swiper-slide page1 yj_bbg">
            <div class="sbox">
                <img class="logo" src="images/public/logo.png" alt="优乐logo">
                <div class="topbox">
                    <div class="header ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="2s" swiper-animate-delay="0s">
                        <img style="transform: rotateZ(270deg);" src="images/p1/img1.png">
                    </div>
                    <div class="toptext">
                        <p class="ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="0s">2016年</p>
                        <p class="ani bigp" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">1000辆宝马</p>
                    </div>
                </div>
                <div class="mfzs" style="animation: slideInDown 2.4s ease 0s infinite both;">
                    <img src="images/p1/mfzs.png" alt="">
                </div>
                <div class="centertext">
                    <p>优乐</p>
                    <p>集团</p>
                    <p class="smalltext">为生命服务</p>
                </div>
                <div>
                    <img class="ani infinite w5 car" swiper-animate-effect="bounceInRight " swiper-animate-duration="3.4s" swiper-animate-delay="0.1s"  src="images/public/car.png" alt="">
                </div>
                <div class="footbox">
                    <img class="ani" swiper-animate-effect="flash" swiper-animate-duration="2s" swiper-animate-delay="0" src="images/p1/bluelight.png" alt="">
                </div>
                
            </div>
            <div class="swiper_page">1/23</div>
        </div>
        <!--页面2-->
        <div class="swiper-slide page2 yj_bbg">
            <div class="sbox">
                <img class="centerimg w5 ani infinite" swiper-animate-effect="wobble" swiper-animate-duration="2s" swiper-animate-delay="0s" src="images/p2/jm.png" alt="">
                <div class="text">
                    <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="0s">加盟一个项目</p>
                    <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="0.5s">收获一份事业</p>
                    <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s" swiper-animate-delay="1s">保持一份健康</p>
                </div>
                <div class="footbox">
                    <img class="centerimg ani" swiper-animate-effect="flip" swiper-animate-duration="2s"  swiper-animate-delay="1.6" src="images/p2/bmlogo.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="1s"  swiper-animate-delay="0s">优乐集团，千辆宝马赠送</p>
                </div>
            </div>
            <div class="swiper_page">2/23</div>
        </div>
        <!--页面3-->
        <div class="swiper-slide page3 yj_bbg">
            <div class="sbox">
                <img src="images/p3/img1.png" class="ani p3_1"alt="" swiper-animate-effect="bounceInDown " swiper-animate-duration="1s" swiper-animate-delay="0" >
                <p class="ani plet"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">Lagniappe ＋Brains＋Services=Life Bank System</p>
                <p class="ani"swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="1s">赠品+智能+服务=生命银行</p>
                <h3 class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="1.5s">颠覆传统健康产业<br>首发云集<b>大派送</b></h3>
                <img src="images/p3/img2.png" class="ani p3_1"alt="" swiper-animate-effect="zoomIn" swiper-animate-duration="2s" swiper-animate-delay="2s" >
                <h2 class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="2.5s">Sorry</h2>
                <img src="images/p3/img3.png" class="ani p3_2"alt="" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="3s"alt="" width="30%"> 
                <img src="images/p3/img3.png" class="ani p3_2"alt="" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="3.4s"alt="" width="40%"> 
                <img src="images/p3/img3.png" class="ani p3_2"alt="" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="3.8s"alt="" width="50%"> 
            </div>
            <div class="swiper_page">3/23</div>
        </div>
        <!--页面4-->
        <div class="swiper-slide page4 yj_bbg">
            <div class="sbox">
                <div class="p4_txt p_t1">
                    <p class="ani"swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="0s">没看错吧？！</p>
                    <p class="ani"swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="0.2s">不相信自己的眼睛吧？！</p>
                    <p class="ani"swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="0.4s">有点傻了吧？！</p>
                    <p class="ani"swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="0.6s">鸡冻的时刻就要来啦！</p>
                    <p class="ani"swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="0.8s">全国首家，世界首例！</p>
                </div>
                <img src="images/public/car.png" alt="" width="60%" class="ani imgb" swiper-animate-effect="bounceInRight " swiper-animate-duration="2s" swiper-animate-delay="1.2s" >
                <img src="images/p4/img1.png" alt="" class="ani" swiper-animate-effect="bounceInLeft " swiper-animate-duration="2s" swiper-animate-delay="1.6s" >
                <div class="ani p4_txt p_t2" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay="2s">
                    <p>免费送<b>10万台</b>智能监测机器人</p>
                    <p>免费送<b>10万台</b>智能健康水系统</p>
                    <p>免费送<b>2000万台</b>智能健康水系统</p>
                    <p>免费送<b>2000万台</b>智能健康空气系统</p>
                    <p>免费送<b>2000万台</b>智能健康净化系统</p>
                    <h4 class="ani">免费送 韩国三星保健食品：肝宝、血通、酵素<br>免费送 韩国KSCB干细胞面膜、手膜、脚膜等<br>免费送 韩国星级旅游</h4>
                </div>
            </div>
            <div class="swiper_page">4/23</div>
        </div>
        <!--页面5-->
        <div class="swiper-slide page5 yj_bbg">
            <div class="sbox">
                <div class="p5_box">
                    <img src="images/p5/img0.png" alt="" class="ani"swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="0s">
                    <img src="images/p5/t0.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".5s">

                    <img src="images/p5/img1.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="1.5s">
                    <img src="images/p5/t1.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="2s">

                    <img src="images/p5/img2.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="3s">
                    <img src="images/p5/t2.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="3.5s">

                    <img src="images/p5/img3.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="4.5s">
                    <img src="images/p5/t3.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="5s">

                    <img src="images/p5/img4.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="6s">
                    <img src="images/p5/t4.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="6.5s">

                    <img src="images/p5/img5.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="7.5s">
                    <img src="images/p5/t5.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="8s">

                    <img src="images/p5/img6.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="9s">
                    <img src="images/p5/t6.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="9.5s">

                    <img src="images/p5/img7.png" alt="" class="ani"swiper-animate-effect="fadeIn" swiper-animate-duration="2s" swiper-animate-delay="10.5s">
                    <img src="images/p5/t7.png" alt="" class="ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="11s">
                </div>
            </div>
            <div class="swiper_page">5/23</div>
        </div>
        <!--页面6-->
        <div class="swiper-slide page6 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p6/p6_r1_c6.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">史上最雷人的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p6/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <img class="w5 p6car ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="3s" swiper-animate-delay="1s"  src="images/public/car.png" alt="">
                    <p class="p6text ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="2s">1000辆宝马X1免费送</p>
                </div>
                <div class="footbox">
                    <img class="hg ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="3.2s"  src="images/p6/huangguan.png" alt="">
                    <p swiper-animate-effect="bounceInUp" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s"><span class="bigyellow">土豪</span>交个朋友吧</p>
                    <img class="bottomlight ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="3.8s"  src="images/p6/light.png" alt="">
                </div>
            </div>
            
            <div class="swiper_page">6/23</div>
        </div>
        <!--页面7-->
        <div class="swiper-slide page7 yj_bbg">
            <div class="sbox">
                <p class="p1 ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">赠送机制</p>
                <p class="p2 ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.5s">一次性加盟10台机器人=免费送1辆</p>
                <img class="ani infinite" swiper-animate-effect="wobble" swiper-animate-duration="2s" swiper-animate-delay="0s" src="images/p7/30wan.png" alt="">
                <p class="p3 ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="1s">（五年使用权）</p>
                <img class="imgblock ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s" src="images/p7/img1.png" alt="">
                <img class="imgblock ani infinite" swiper-animate-effect="rubberBand " swiper-animate-duration="2s" swiper-animate-delay="0s" src="images/p7/img2.png" alt="">
                <img class="imgblock ani w9 footbox" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="0.5"  src="images/public/car.png" alt="">
            </div>
            
            <div class="swiper_page">7/23</div>
        </div>
        <!--页面8-->
        <div class="swiper-slide page8 yj_bbg">
            <div class="sbox">
                <p class="p1 ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="0.2s">赠送机制</p>
                <p class="p2 ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.2s">起止时间：</p>
                <p class="p3 ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.9s">2016年7月22日起</p>
                <div class="p4">
                    <img class="ani infinite" swiper-animate-effect="wobble" swiper-animate-duration="2s" swiper-animate-delay="0s" src="images/p8/1000.png" alt="">
                    <p class="p3 ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.4s">辆宝马送完即止</p>
                </div>
                <img class="imgblock ani" swiper-animate-effect="bounceIn" swiper-animate-duration="2s" swiper-animate-delay="0" src="images/p8/tb.png" alt="">
                <img class="imgblock ani car1" swiper-animate-effect="fadeInRight" swiper-animate-duration="3s" swiper-animate-delay="0.2s" src="images/public/car.png" alt="">
                <img class="imgblock ani car2" swiper-animate-effect="fadeInRight" swiper-animate-duration="3s" swiper-animate-delay="0.2s" src="images/public/car.png" alt="">
                <img class="imgblock ani car3" swiper-animate-effect="fadeInRight" swiper-animate-duration="3s" swiper-animate-delay="0.2s" src="images/public/car.png" alt="">
                <img class="imgblock ani car4" swiper-animate-effect="fadeInRight" swiper-animate-duration="3s" swiper-animate-delay="0.2s" src="images/public/car.png" alt="">
            </div>
            
            <div class="swiper_page">8/23</div>
        </div>
        <!--页面9-->
        <div class="swiper-slide page9 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p6/p6_r1_c6.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最具前景的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p9/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn filp" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <p class="p6text ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".5s">大数据呈现</p>
                    <p class="p6text ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".5s">生命科技产业大前景<hr> </p>
                    <ul class="ani p9ul" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay=".5s">
                        <li><img class="ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p9/dot.png" alt="">8万亿现有增量市场空间</li>
                        <li><img class="ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p9/dot.png" alt="">13.7亿用户群体</li>
                        <li><img class="ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p9/dot.png" alt="">5亿精准用户</li>
                        <li><img class="ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p9/dot.png" alt="">2.6亿慢性病患者</li>
                    </ul>
                </div>
                <div class="footbox ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay=".6s" >
                    中国的健康产业产值，与发达国家相比，有着8万亿人民币的差距，增量市场空间巨大。目前国内13.7亿人口，人人皆需关注自身健康。2040年，中国老年人口达5亿，皆为生命健康行业精准用户。我国慢性病患者超2.6亿，患病率十年增长1倍，慢性病死亡率占总死亡率85%。                    </div>
            </div>
            
            <div class="swiper_page">9/23</div>
        </div>
        <!--页面10-->
        <div class="swiper-slide page10 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p6/p6_r1_c6.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最靠谱的项目</p>
                </div>
                <p class="p1 ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".3s">超强实力</p>
                <div class="p10text ani"swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".5s">
                    <p>1000名销售精英</p>
                    <p>200000㎡舒美服饰厂</p>
                    <p>30000合作商家资源</p>
                    <p>15000㎡湖北武汉总部大楼</p>
                </div>
                <div class="p6center">
                    <img class="pc" style="z-index: 1;" src="images/p10/img1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="4.4s" swiper-animate-delay="0" src="images/p10/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0" src="images/p6/p6_r1_c2.png" alt="">
                </div>
            </div>
            
            <div class="swiper_page">10/23</div>
        </div>
        <!--页面11-->
        <div class="swiper-slide page11 yj_bbg">
            <div class="sbox">
                <h3 class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">超硬技术<span>TECHNOLOGE</span></h3>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"><img src="images/p11/img_r1_c1.jpg" alt=""></dt>
                    <dd class="d1 ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="0.8s"><p>物联网为基础</p><p>互联网为手段</p><p>生命科学为方向</p></dd>
                </dl>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.3s"><img src="images/p11/img_r3_c1.jpg" alt=""></dt>
                    <dd class="d2 ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="1s">生物电阻检测技术</dd>
                </dl>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.5s"><img src="images/p11/img_r5_c1.jpg" alt=""></dt>
                    <dd class="d2 ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="1.2s">地理围栏技术</dd>
                </dl>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s"><img src="images/p11/img_r7_c1.jpg" alt=""></dt>
                    <dd class="d2 ani" swiper-animate-effect="fadeIn" swiper-animate-duration="1s" swiper-animate-delay="1.4s">ZigBee技术</dd>
                </dl>
            </div>
            
            <div class="swiper_page">11/23</div>
        </div>
        <!--页面12-->
        <div class="swiper-slide page12 yj_bbg">
            <div class="sbox">
                <h3 class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">权威专利技术<br>权威资质认证</h3>
                <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".6s">7项软件著作权</p>
                <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".6s">4项外观设计专利</p>
                <p class="ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay=".6s">11项实用新型专利</p>
                <img class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="2s" swiper-animate-delay="0.4s" src="images/p12/img1.jpg" alt="">
            </div>
            
            <div class="swiper_page">12/23</div>
        </div>
        <!--页面13-->
        <div class="swiper-slide page13 yj_bbg">
            <div class="sbox">
                <div class="ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="2s" swiper-animate-delay="0.4s">
                    <h3>超广资源<span>RESOURCES</span></h3>
                    <h4>三家上市公司资源协同</h4>
                </div>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"><img src="images/p13/img.jpg" alt=""></dt>
                    <dd class="d1 ani dd_bg" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="0.8s">
                        <p class="p1 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.2s" swiper-animate-delay="1.3s">真白斯</p>
                        <p class="p2">股票代码：082270</p>
                        <p class="p3 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="2s" swiper-animate-delay="0">抗癌疫苗、肽新药、DNA疫苗研发 ，半导体过滤器制造。</p>
                    </dd>
                </dl>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.3s"><img src="images/p13/img_r1_c1.jpg" alt=""></dt>
                    <dd class="d1 ani dd_bg" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="1s">
                        <p class="p1 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.2s" swiper-animate-delay="1.9s">KSCB</p>
                        <p class="p2">股票代码：065940</p>
                        <p class="p3 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="2s" swiper-animate-delay="0.5s">干细胞科研、日化产品研发、金枪鱼打捞、酒店业务。</p>
                    </dd>
                </dl>
                <dl class="mydl">
                    <dt class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0.5s"><img src="images/p13/img_r3_c1.jpg" alt=""></dt>
                    <dd class="d1 ani dd_bg" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="1.8s">
                        <p class="p1 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.2s" swiper-animate-delay="2.5s">三星制药</p>
                        <p class="p2">股票代码：001360</p>
                        <p class="p3 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="2s" swiper-animate-delay="1s">三星制药：始于1929，生物医学、生物制药技术全球领先。</p>
                    </dd>
                </dl>
            </div>
            
            <div class="swiper_page">13/23</div>
        </div>
        <!--页面14-->
        <div class="swiper-slide page14 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p14/img1.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最赚钱的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p14/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn filp" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <p class="p6text ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">蓝海策略：</p>
                    <div class="p1 ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">
                        <p>目前，生命科学领域</p>
                        <p>尚未有巨头进入，</p>
                        <p>市场规模却空达万亿美元，</p>
                        <p>属商业蓝海。<hr> </p>
                    </div>
                    <div class="p2 ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="1.6s">
                        <p>下一个风口在哪儿？</p>
                        <p>第六次工业革命</p>
                        <p>——生命科学革命</p>
                    </div>

                </div>
            </div>
            
            <div class="swiper_page">14/23</div>
        </div>
        <!--页面15-->
        <div class="swiper-slide page15 yj_bbg">
            <div class="sbox ani" swiper-animate-effect="rollIn" swiper-animate-duration="1s" swiper-animate-delay="0s">
                <div class="p15box">
                    <p class="p1 ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay=".6s" >第六次工业革命（生命科学）的倡导者：</p>
                    <p  swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">每一次工业革命，都会带动了整个产业的繁荣发展：纺织、钢铁、石油、汽车、信息革命。</p>
                    <p  swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">优乐集团紧握时代脉搏，为第六次工业革命（生命科学）的倡导者和推进者，必将带动整个健康科技产业大繁荣。</p>
                    <p  swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="2s">随着全民生活水平的提升和健康意识的加强，我国医疗资源供给严重短缺，优乐集团颠覆健康传统行业，致力于家用智能健康监测、远程医疗，商用智能健康监测设备的生产与研发，必成为新风口生命科学健康最赚钱的项目。</p>
                </div>
            </div>
            <div class="swiper_page">15/23</div>
        </div>
        <!--页面16-->
        <div class="swiper-slide page16 yj_bbg">
            <div class="sbox ani" swiper-animate-effect="rollIn" swiper-animate-duration="1s" swiper-animate-delay="0s">
                <div class="p15box">
                    <p class="p1 ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="1s" >会赚钱的优乐智能健康监测机器人</p>
                    <p  class="ani c16" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">加盟多重收益</p>
                    <p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s"><b>A.</b>加盟<span class="yellow">免  费</span>送宝马X1一辆</p>
                    <p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">五年使用权</p>
                    <img class="ani mycar" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="1s" src="images/public/car.png" alt="">
                    <p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="2s"><b>B.</b>签约<span class="yellow">400家</span>战略广告合作商，最高可赚取100%广告收益。</p>
                    <p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="2s"><b>C.</b>向每个粉丝赠送一台优乐智能健康水系统、空气系统、净化系统，</p>
                    <p class="ani yellow"  swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="2s">最高可获480元收益。</p>
                </div>
            </div>
            <div class="swiper_page">16/23</div>
        </div>
        <!--页面17-->
        <div class="swiper-slide page17 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p17/img1.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最省心的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p14/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn filp" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <div class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">
                        <p class="p1">会电脑就行！</p>
                        <p class="p2">只需将机器人联网，系统自动更新</p>
                        <p class="p1">会开车就行！</p>
                        <p class="p2">优乐送的宝马，开出去随便溜</p>
                        <p class="p1">会说话就行</p>
                        <p class="p2">好项目，说给更多人听</p>
                    </div>
                </div>
            </div>
            
            <div class="swiper_page">17/23</div>
        </div>
        <!--页面18-->
        <div class="swiper-slide page18 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p6/p6_r1_c6.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最快成功的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p6/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <div  class="ani mydiv">
                        <p class="ani p1" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">优乐独创LBS <br>商业模式带领集团</p>
                        <p class="ani p2" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1.3s">以最快速度进入资本市场</p>
                        <p class="ani p1" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1.6s">优乐以赠送产品、服务费增值,保障企业利益</p>
                        <p class="ani p3" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1.3s">2000万台</p>
                        <p class="ani p5" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1.8s">优乐智能健康水系统<br>免费送用户<br>每月仅需100元—400元/台<br>服务费，即可享受以下<br>超值服务：</p>
                    </div>
                </div>
                <div class="foot ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay=".6s" >
                    <p>1、免费更换滤芯、拆装过程中的全部密封圈、活性炭、      KDF滤料及保养更新KDF反应器装置及磁化器； </p>
                    <p>2、免费清洁消毒净水器;   </p>
                    <p>3、免费测试调整控制器。 </p>
                    <p>4、月赠价值100-400元集团创新产品。</p>
                </div>
            </div>
            
            <div class="swiper_page">18/23</div>
        </div>
        <!--页面19-->
        <div class="swiper-slide page19 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <div class="p6top">
                    <img class="centerimg ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s"  src="images/p19/img1.png" alt="">
                    <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0.6s">最具共赢的项目</p>
                </div>
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="fadeIn" swiper-animate-duration="2.4s" swiper-animate-delay="1s" src="images/p14/bg2.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn filp" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">
                    <div class="p1 ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="2s" swiper-animate-delay="1s">
                        <p>价值共享</p>
                        <p>利润共享</p>
                        <p>前景共享</p>
                        <p>未来共享<hr> </p>
                    </div>
                    <div class="p2 ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="1.6s">
                        <p>优乐人不断完善产品与自身，</p>
                        <p>持续为生命服务。</p>
                    </div>

                </div>
            </div>
            
            <div class="swiper_page">19/23</div>
        </div>
        <!--页面20-->
        <div class="swiper-slide page20 yj_bbg">
            <div class="sbox">
                <img class="img1 ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="1.5s" swiper-animate-delay="0s"  src="images/p20/img1.jpg" alt="">
                <img class="img2 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1.5s" swiper-animate-delay="0s" src="images/p20/img2.png" alt="">
                <p class="ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1.2s" swiper-animate-delay="0.2s">优乐集团是以物联网为基础、互联网为手段、生命科学为方向的大型综合性产业集团，专心致力于家用智能健康监测、远程医疗，商用智能健康监测设备的生产与研发事业。</p>
            </div>
            
            <div class="swiper_page">20/23</div>
        </div>
        <!--页面21-->
        <div class="swiper-slide page21 yj_bbg">
            <div class="sbox">
                <div class="ani" swiper-animate-effect="fadeInDown " swiper-animate-duration="2s" swiper-animate-delay="0">
                    <p class="p1">等你来</p>
                </div>
                <input class="ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="1s" swiper-animate-delay="0.8s" type="text" placeholder="姓名" id="name" maxlength="20">
                <input class="ani" swiper-animate-effect="bounceInRight " swiper-animate-duration="1s" swiper-animate-delay="1s" type="text" placeholder="手机" id="phone" maxlength="13">
                <input class="ani" swiper-animate-effect="bounceInRight " swiper-animate-duration="1s" swiper-animate-delay="1.6s" type="button" value="报&nbsp;&nbsp;名" id="btn" onclick="insert()">
                <img src="images/p21/logo.png" class="ani" swiper-animate-effect="fadeInUp " swiper-animate-duration="2s" swiper-animate-delay="3s" alt="">
            </div>
            
            <div class="swiper_page">21/23</div>
        </div>
        <!--页面22-->
        <div class="swiper-slide page22 yj_bbg">
            <div class="sbox">
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="0.4s" src="images/p22/img1.png" alt="">
                    <img class="pc ani" style="animation-timing-function: linear;" swiper-animate-effect="zoomIn" swiper-animate-duration="2s" swiper-animate-delay="0.6s" src="images/p22/img2.png" alt="">
                    <img class="pc ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="1s" src="images/p22/logo.png" alt="">
                    <div  class="p1 ani">
                        <p class="ani pr" swiper-animate-effect="bounceInLeft" swiper-animate-duration="2s" swiper-animate-delay="0s">优乐健康万里行</p>
                        <p class="ani pl" swiper-animate-effect="bounceInRight" swiper-animate-duration="2s" swiper-animate-delay="0s">千辆宝马免费领</p>
                    </div>
                    <img class="ani img4" swiper-animate-effect="bounceInRight" swiper-animate-duration="1s" swiper-animate-delay="1s" src="images/p22/img4.png" alt="">
                </div>
                <img class="clock ani" swiper-animate-effect="wobble" swiper-animate-duration="1s" swiper-animate-delay="0s" src="images/p22/img3.png" alt="">
            </div>
            
            <div class="swiper_page">22/23</div>
        </div>
        <!--页面23-->
        <div class="swiper-slide page23 yj_bbg">
            <div class="sbox">
                <img class="pt ani infinite"  src="images/p6/yellodot.png" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0" alt="">
                <img class="pb ani infinite" swiper-animate-effect="flash" swiper-animate-duration="6s" swiper-animate-delay="0"  src="images/p6/orgdot.png" alt="">
                <img class="logo" src="images/public/logo.png" alt="优乐logo">
                <div class="p6center">
                    <img class="pc ani" swiper-animate-effect="bounceIn" swiper-animate-duration="1.2s" swiper-animate-delay="0.2s" src="images/p23/img.png" alt="">
                    <img class="pc ani infinite" style="animation-timing-function: linear;" swiper-animate-effect="rotateIn filp" swiper-animate-duration="10s" swiper-animate-delay="0s" src="images/p6/p6_r1_c1.png" alt="">
                    <img class="pc ani infinite" swiper-animate-effect="rotateIn" swiper-animate-duration="20s" swiper-animate-delay="0s" src="images/p6/p6_r1_c2.png" alt="">

                    <div class="p2 ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="2s" swiper-animate-delay="1s">
                        <img src="images/p23/sys.png" alt="">
                        <p>扫一扫</p>
                    </div>
                </div>
                <div class="foot ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="2s" swiper-animate-delay=".6s" >
                    <p><span class="phone"></span>拨打了解更多优惠详情</p>
                    <p class="yellow">400-852-2399</p>
                    <p style="text-align: left;">优乐地址：</p>
                    <p>湖北省武汉市东湖高新区光谷大道光谷金融港A13栋3楼</p>
                </div>
            </div>
            
            <div class="swiper_page">23/23</div>
        </div>
    </div>
</div>
<script>
var media = {
    changeClass: function(target, id) {
        var className = $(target).attr('class');
        var ids = document.getElementById(id); (className == 'on') ? $(target).removeClass('on').addClass('off') : $(target).removeClass('off').addClass('on'); (className == 'on') ? ids.pause() : ids.play()
    },
    play: function() {
        document.getElementById('media').play()
    }
}
$(function() {
    $(window).on("load",function() {
        var mySwiper = new Swiper('.swiper-container', {
            onInit: function(swiper) {
                swiperAnimateCache(swiper);
                swiperAnimate(swiper);
            },
            onSlideChangeEnd: function(swiper) {
                swiperAnimate(swiper);
            },
            mousewheelControl: true,
            direction: 'vertical',
            loop: !0,
            preventClicks: false,
        })
    }) 
    media.play()
})

function insert(){
	 if($("#name").val().trim()==''){
	    	alert("请填写姓名");
	    	return;
	    }
	var reg= /^(133|153|177|180|181|189|134|135|136|137|138|139|150|151|152|157|158|159|178|182|183|184|187|188|130|131|132|155|156|176|185|186|145|147|170)\d{8}$/;
    if(!reg.test($("#phone").val())){  
        alert("请输入正确的手机号");
        return;
    }
	$("#btn").attr("disabled","disabled");
	$.ajax({
		url:'insert',
		dataType:'json',
		data:{name:$("#name").val().trim(),phone:$("#phone").val()},
		success:function(data){
			alert(data.msg)
			$("#btn").removeAttr("disabled");
		},
		error:function(req,err,ecp){
			alert("网络异常")
			$("#btn").removeAttr("disabled");
		}
	});
}
</script>
</body>
</html>